<template>
	<div id="container">
		<h3 style="margin-bottom: 20px;">系统配置</h3>
		<div>
			<el-button type="primary" @click="addSystemConfig()">新增</el-button>
			<el-button type="primary">删除</el-button>
			<el-button type="primary" @click="doSystemConfig()">保存</el-button>
			<el-button type="primary">取消</el-button>
		</div>
		<div style="margin-top: 30px;">
			<el-radio-group v-model="flagone" style="width: 900px;">
				<el-table :data="list" style="width: 100%">
					<el-table-column prop="config" label="选择" width="180">
						<template slot-scope="scope">
							<el-radio :label="scope.row.myid" @change="mychange(scope.row)">&nbsp;</el-radio>
						</template>
					</el-table-column>
					<el-table-column prop="configcode" label="配置类型编码" width="180">
						<template slot-scope="scope">
							<el-input v-model="scope.row.configcode"></el-input>
						</template>
					</el-table-column>
					<el-table-column prop="configname" label="配置类型名称">
						<template slot-scope="scope">
							<el-input v-model="scope.row.configname"></el-input>
						</template>
					</el-table-column>
					<el-table-column prop="configname" label="描述">
						<template slot-scope="scope">
							<el-input v-model="scope.row.configname"></el-input>
						</template>
					</el-table-column>
					<el-table-column prop="isstart" label="是否启用">
						<template slot-scope="scope">
							<el-checkbox v-model="scope.row.isstart" :true-label="1" :false-label="0"
								@change="doUpdStart(scope.row)"></el-checkbox> <!-- 使用复选框展示状态 -->
						</template>
					</el-table-column>
				</el-table>
			</el-radio-group>
		</div>
		<div style="margin: 30px 0;">
			<el-button type="primary" @click="addSystemConfigTwo()">新增</el-button>
			<el-button type="primary">删除</el-button>
			<el-button type="primary" @click="doSystemConfigTwo()">保存</el-button>
			<el-button type="primary">取消</el-button>
		</div>
		<div style="margin-top: 30px;">
			<el-radio-group v-model="flagtwo" style="width: 900px;">
				<el-table :data="paramlist" style="width: 100%" id="mySystemConfig">
					<el-table-column prop="config" label="选择" width="180">
						<template slot-scope="scope">
							<el-radio :label="scope.row.myidtwo">&nbsp;</el-radio>
						</template>
					</el-table-column>
					<el-table-column prop="configvalueid" label="配置参数ID" width="180">
						<template slot-scope="scope">
							<el-input v-model="scope.row.configvalueid"></el-input>
						</template>
					</el-table-column>
					<el-table-column prop="configvaluename" label="配置参数名称">
						<template slot-scope="scope">
							<el-input v-model="scope.row.configvaluename"></el-input>
						</template>
					</el-table-column>
				</el-table>
			</el-radio-group>
		</div>
	</div>
</template>

<script>
	import {
		queryBySystemConfig,
		queryByConfigName,
		addPsSystemconfig //添加主表的
	} from '@/config/request'

	export default {
		data() {
			return {
				psSystemconfig: {
					id: '',
					configcode: '',
					configname: '',
					configvalueid: '',
					configvaluename: '',
					isstart: '',
					pageNum: '1',
				},
				list: [],
				flagone: '', // 设置 aaa 为空字符串
				flagtwo: '', // 设置 aaa 为空字符串
				paramlist: [] //参数集合
			}
		},
		methods: {
			load() {
				queryBySystemConfig().then(json => {
					let i = 1;
					this.list = json.data.list.map(item => {
						i++;
						return {
							...item,
							myid: i
						};
					});
					if (this.list.length > 0) {
						this.flagone = this.list[0].myid;
					}
					//选中第一条
					this.mychange(this.list[0])
				});
			},
			mychange(row) {
				this.paramlist = [];
				queryByConfigName(row).then(json => {
					let i = 1;
					this.paramlist = json.data.list.map(item => {
						i++;
						return {
							...item,
							myidtwo: i
						};
					});
					if (this.paramlist.length > 0) {
						this.flagtwo = this.paramlist[0].myidtwo;
					}
				})
			},
			//添加一行 主
			addSystemConfig() {
				const newRow = {
					config: '',
					configvalueid: '',
					configvaluename: '',
					myidtwo: this.paramlist.length + 1,
					isstart: '',
				};
				this.list.push(newRow);
			}, //点击保存
			doSystemConfig() {
				// 处理新增的数据
				const newData = this.list.slice(-1); // 获取最后一个新增的数据
				console.log('新增数据:', newData);
				console.log('所有数据:', this.list);
				// 在这里执行您的逻辑，例如将数据发送到后端或进行其他操作
				alert('新增数据:' + JSON.stringify(newData));
				addPsSystemconfig(newData).then(json => {

				})
			},
			//添加一行 主
			addSystemConfigTwo() {
				const newRow = {
					configvalueid: '',
					configvaluename: ''
				};
				this.paramlist.push(newRow);
			},
			doSystemConfigTwo() {
				// 处理新增的数据
				const newData = this.paramlist.slice(-1); // 获取最后一个新增的数据
				console.log('新增数据:', newData);
				// 在这里执行您的逻辑，例如将数据发送到后端或进行其他操作
				alert('新增数据:' + JSON.stringify(newData));
				/* addPsSystemconfig(newData).then(json => {

				}) */
			}
		},
		mounted() {
			this.load();
		}
	}
</script>

<style>
</style>